<template>
	<router-link class="list-item" :to='item.to'>
		<div @click="$emit('routeChange')">
			<p class="c-txt-s grey">编号: {{item.repairNumber}}</p>
			<p class="c-txt-s grey">{{item.applyUserName}}: {{item.applyUserPhone}}</p>
			<p class="c-txt-m">
				{{item.repairExplains.length > 12 ? item.repairExplains.slice(0,12) : item.repairExplains}}
			</p>
			<p class="c-txt-s location ellipsis">{{item.repairAddress}}</p>
			<div class="c-btn" v-if="item.statusCode == 'WAIT_RECEIVE'">待接收</div>
			<div class="c-btn reverse" v-if="item.statusCode == 'IN_HANDLE'">处理中</div>
			<div class="c-btn black" v-if="item.statusCode == 'WAIT_EVALUATE'">待评价</div>
			<div class="c-btn grey" v-if="item.statusCode == 'FINISH'">已评价</div>
			<div class="c-btn black" v-if="item.statusCode == 5">申请二次处理</div>
			<div class="c-btn" v-if="item.statusCode == 'WAIT_DISPATCH'">待分配</div>
			<div class="c-btn grey" v-if="item.statusCode == 'STOP'">已中止</div>
			<div class="c-btn" v-if="item.statusCode == 'DISPATCH_S'">待分配</div>
		</div>
	</router-link>
</template>
<script>
	export default{
		name:'listItem',
		mounted(){
		},
		props: ['item']
	}
</script>
<style lang='less' scoped>
	.list-item{
		margin-top: 0.27rem;
		padding: 0.27rem .4rem 0;
		background: #fff;
		position: relative;
		display: block;
		.c-txt-m{
			line-height: .9rem;
			margin-bottom: .1rem;
		}
		.location{
			border-top: 1px solid #ddd;
			line-height: .85rem;
			padding-left: 0.6rem;
			background: url(./assets/img/address@1.5x.png) left center no-repeat;
			background-size: .4rem .45rem;
		}
		.c-btn{
			position: absolute;
			top: 0.89rem;
			right: .4rem;
		}
	}
</style>